<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title></title>
<#include "/jeecms_sys/head.html"/>
<script type="text/javascript">
$(function() {
	$("#jvForm").validate();
	$("#tempForm").validate({
	    submitHandler: function(form) {
		var options = {
		        url: '../directive/v_getcode.do',
		        type: 'post',
		        dataType: 'json',
		        data: $("#tempForm").serialize(),
		        success:  function (data) {
					insert(data.code);
					$( "#tempDialog" ).dialog("close");
		        }
		    };
	    $.ajax(options);
	    return false;
	    }
	});
	$("#operator").load("../directive/module.do?module=channel");
	$("#directiveDialog").dialog({
		autoOpen: false,
		height: 400,
		width: 450,
		modal: true,
		buttons: {
			"<@s.m code='directive.code.insert'/>": function() {
				var directive=$("#selectCode").val();
				insert(directive);
				$( "#directiveDialog" ).dialog("close");
			}
		}
	});
	$("#tempDialog").dialog({
		autoOpen: false,
		height: 400,
		width: 450,
		modal: true
	});
	$("#directiveButton").click(function() {
		$( "#directiveDialog" ).dialog("open");
	});
	$("#tempImport").click(function() {
		$( "#directiveDialog" ).dialog("close");
		$( "#tempDialog" ).dialog("open");
	});
});
function designDialog(url){
	var html=$("#source").val();
	var result=window.showModalDialog(url,html,"dialogHeight:800px;dialogWidth:1000px;center:yes;resizable: yes;");
	if(result!=null){
		$("#source").val(result);
	}
}
function selectTpl(){
	var id=$('#selectTpl').val();
	$("#selectDecri").html($("#d_"+id).val());
	$("#selectCode").val($("#t_"+id).val());
}
//未定位鼠标则插入开始位置
function insert(str){
    var source = document.getElementById("source");
    var sourcelen = source.value.length;
    source.focus();
    if(typeof document.selection != "undefined")
    {
        document.selection.createRange().text = str;  
    }
    else
    {
    	source.value = source.value.substr(0,source.selectionStart)+str+source.value.substring(source.selectionStart,sourcelen);
    }
}
function selectModule(){
	var module=$("#module").val();
	$("#operator").load("../directive/module.do?module="+module);
}
</script>
</head>
<body>
<div class="box-positon">
	<div class="rpos"><@s.m "global.position"/>: <@s.m "template.function"/> - <@s.m "global.add"/></div>
	<form class="ropt">
		<input type="hidden" name="root" value="${root}"/>
		<input class="return-button" type="submit" value="<@s.m "global.backToList"/>" onclick="this.form.action='v_list.do';"/>
	</form>
	<div class="clear"></div>
</div>
<div class="body-box">
<div class="editor-style">
<div class="editor-bbg">
<form action="v_add.do" style="padding-top:5px;">
<input type="hidden" name="root" value="${root}"/>
<input type="radio" name="style" value="textarea" checked="checked" onclick="this.form.submit();" style="margin-left:40px;"/><@s.m "template.textarea"/>
<input type="radio" name="style" value="editor" onclick="this.form.submit();" style="margin-left:95px;"/><@s.m "template.editor"/>
</form>
</div>
</div>
<@p.form id="jvForm" action="o_save.do" labelWidth="15">
<@p.text  colspan="1" width="50" label="template.filename" name="filename" size="30" required="true" class="required" maxlength="100" help=".html"/>
<@p.td colspan="1" >
<input id="directiveButton" class="pfzgl" type="button" value="<@s.m 'directive.directives'/>"/>
</@p.td><@p.tr/>
<@p.td colspan="2"><@p.textarea id="source" name="source" style="width:90%;height:350px" wrap="off" maxlength="1232896"/></@p.td><@p.tr/>
<@p.td colspan="2">
	<input type="hidden" name="root" value="${root}"/>
	<@p.submit code="global.submit"/> &nbsp; <@p.reset code="global.reset"/>
</@p.td>
</@p.form>
</div>
<div id="directiveDialog" title="<@s.m 'directive.directives'/>">
	<div style="color: red;"><@s.m  "directive.directives.help"/></div>
	<@s.m "directive.directives"/><select name="tpl" id="selectTpl" onchange="selectTpl()">
	<#list directives as d>
	<option value="${d.id}">${d.name!}</option>
	</#list>
	</select> <input id="tempImport" type="button" value="<@s.m 'directive.directive.temp'/>"/> <br />
	<@s.m "directive.description"/><div  id="selectDecri" ><#if directives?size gt 0>${directives[0].description!}</#if></div>
	<@s.m "directive.code"/><textarea  id="selectCode" cols="40" rows="8"><#if directives?size gt 0>${directives[0].code!}</#if></textarea>
	<#list directives as d>
	<textarea style="display: none;" id="t_${d.id}">${d.code!}</textarea>
	<textarea style="display: none;" id="d_${d.id}">${d.description!}</textarea>
	</#list>
</div>

<div id="tempDialog" title="<@s.m 'directive.directives'/>">
	<div style="color: red;"><@s.m  "directive.directives.help"/></div>
	<@p.form id="tempForm" action="../directive/v_getcode.do" labelWidth="12">
	<@p.td required="true" label='directive.module' colspan='2' width="100">
	<@p.select onchange="selectModule()" list={"channel":"directive.channel","content":"directive.content","comment":"directive.comment","topic":"directive.topic","vote":"directive.vote","guestbook":"directive.guestbook","advertise":"directive.advertise","link":"directive.link","tag":"directive.tag"} name="module" id="module" colspan="2" width="100"/>
	</@p.td>
	<@p.tr/>
	<@p.td colspan="2" label='directive.module.rule' colspan='2' width="100" >
	<div id="operator"></div>
	</@p.td><@p.tr/>
	<@p.td colspan="2" width="100" ><@p.submit code="directive.code.insert"/></@p.td>
	</@p.form>
</div>
</body>
</html>